
<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <title>服务创建--新建服务页面</title>
      
      <link rel="stylesheet" href="../assets/css/backend-plugin.min.css">
      <link rel="stylesheet" href="../assets/css/backend.css">  </head>
  <body class="  ">
    <!-- loader Start -->
    <div id="loading">
          <div id="loading-center">
          </div>
    </div>
    <!-- loader END -->
    <!-- Wrapper Start -->
    <div class="wrapper">
        <div th:replace="~{common/left-side-nav::left-side-nav}"></div>
        <div th:replace="~{common/top-nav::top-nav}"></div>
      <div class="content-page">

    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12">
                <div class="d-flex flex-wrap align-items-center justify-content-between">
                   <div class="d-flex align-items-center justify-content-between">
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb p-0 mb-0">
                                <li class="breadcrumb-item"><a th:href="@{serveCreate}">服务创建</a></li>
                                <li class="breadcrumb-item active" aria-current="page">新增服务</li>
                            </ol>
                        </nav>
                    </div>
                    <a th:href="@{serveCreate}" class="btn btn-primary btn-sm d-flex align-items-center justify-content-between">
                        <svg xmlns="http://www.w3.org/2000/svg" width="20" viewbox="0 0 20 20" fill="currentColor">
                            <path fill-rule="evenodd" d="M9.707 16.707a1 1 0 01-1.414 0l-6-6a1 1 0 010-1.414l6-6a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l4.293 4.293a1 1 0 010 1.414z" clip-rule="evenodd"></path>
                        </svg>
                        <span class="ml-2">Back</span>
                    </a>
                </div>
            </div>
            <div class="col-lg-12 mb-3 d-flex justify-content-between">
                <h4 class="font-weight-bold0 d-flex align-items-center">添加新的服务</h4>
            </div>
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">
                        <form class="needs-validation" th:action="@{/FuWuGuanLi/serveCreateNew}" method="post" novalidate>
                            <input type="hidden" name="createPeople" th:value="${session.role.username}"/>
                            <div class="col-md-9">
                                <form class="row g-3 date-icon-set-modal">
                                    <div class="col-md-6 mb-3">id
                                        <label for="customer" class="form-label font-weight-bold text-muted text-uppercase">客户姓名</label>
                                        <input type="text" class="form-control"  placeholder="Enter Full Name"
                                               th:value="${serve !=null ?serve.customer : ''}" required maxlength="50"
                                               id="customer"
                                               name="customer"
                                        >
                                    </div>
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label class="form-label font-weight-bold text-muted text-uppercase">Gender</label><br>-->
                                    <!--                                        <div class="form-check form-check-inline">-->
                                    <!--                                            <div class="custom-control custom-radio custom-control-inline">-->
                                    <!--                                                <input type="radio" id="inlineRadio1" name="customRadio-1" class="custom-control-input">-->
                                    <!--                                                <label class="custom-control-label" for="inlineRadio1"> Male </label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                        <div class="form-check form-check-inline">-->
                                    <!--                                            <div class="custom-control custom-radio custom-control-inline">-->
                                    <!--                                                <input type="radio" id="inlineRadio2" name="customRadio-1" class="custom-control-input">-->
                                    <!--                                                <label class="custom-control-label" for="inlineRadio2"> Female </label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                        <div class="form-check form-check-inline mt-2">-->
                                    <!--                                            <div class="custom-control custom-radio custom-control-inline">-->
                                    <!--                                                <input type="radio" id="inlineRadio3" name="customRadio-1" class="custom-control-input">-->
                                    <!--                                                <label class="custom-control-label" for="inlineRadio3"> Other </label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                    </div>-->
                                    <!--                                    <div class="col-md-6 mb-3 position-relative">-->
                                    <!--                                        <label for="Text2" class="form-label font-weight-bold text-muted text-uppercase">Birth Day</label>-->
                                    <!--                                        <input type="text" class="form-control vanila-datepicker" id="Text2" name="event_date" placeholder="Enter Birth Day" autocomplete="off">-->
                                    <!--                                        <span class="search-link">-->
                                    <!--                                            <svg xmlns="http://www.w3.org/2000/svg" class="" width="20" fill="none" viewbox="0 0 24 24" stroke="currentColor">-->
                                    <!--                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>-->
                                    <!--                                            </svg>-->
                                    <!--                                        </span>-->
                                    <!--                                    </div>-->
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label for="Text3" class="form-label font-weight-bold text-muted text-uppercase">Company Name</label>-->
                                    <!--                                        <input type="text" class="form-control" id="Text3" placeholder="Enter Company Name">-->
                                    <!--                                    </div>-->
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label for="Text4" class="form-label font-weight-bold text-muted text-uppercase">Email</label>-->
                                    <!--                                        <input type="text" class="form-control" id="Text4" placeholder="Enter Email">-->
                                    <!--                                    </div>-->
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label for="Text5" class="form-label font-weight-bold text-muted text-uppercase">Phone</label>-->
                                    <!--                                        <input type="text" class="form-control" id="Text5" placeholder="Enter Phone">-->
                                    <!--                                    </div>-->
                                                                        <div class="col-md-6 mb-3">
                                                                            <label for="serveType" class="form-label font-weight-bold text-muted text-uppercase">服务类型</label>
                                                                            <select id="serveType" class="form-select form-control choicesjs" th:value="${serve != null ? serve.serveType : ''}" name="serveType">
                                                                                <option class="" selected="">Select Type</option>
                                                                                <option th:value="咨询" th:text="咨询">咨询</option>
                                                                                <option th:value="建议" th:text="建议">建议</option>
                                                                                <option th:value="投诉" th:text="投诉">投诉</option>
                                                                            </select>
                                                                        </div>
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label for="inputState" class="form-label font-weight-bold text-muted text-uppercase">State/Region</label>-->
                                    <!--                                        <select id="inputState" class="form-select form-control choicesjs">-->
                                    <!--                                            <option class="" selected="">Select State/Region</option>-->
                                    <!--                                            <option value="Ohio">Ohio</option>-->
                                    <!--                                            <option value="Briston">Briston</option>-->
                                    <!--                                            <option value="Nevada">Nevada</option>-->
                                    <!--                                            <option value="Georgia">Georgia</option>-->
                                    <!--                                            <option value="Texas">Texas</option>-->
                                    <!--                                            <option value="California">California</option>-->
                                    <!--                                        </select>-->
                                    <!--                                    </div>-->
                                    <div class="col-md-6 mb-3">
                                        <label for="overview" class="form-label font-weight-bold text-muted text-uppercase">服务概要</label>
                                        <input type="text" class="form-control" placeholder="overview"
                                               th:value="${serve !=null ?serve.overview : ''}" required maxlength="50"
                                               id="overview"
                                               name="overview"
                                        >
                                    </div>
                                    <!--                                    <div class="col-md-6 mb-3">-->
                                    <!--                                        <label for="Text7" class="form-label font-weight-bold text-muted text-uppercase">Zipcode</label>-->
                                    <!--                                        <input type="text" class="form-control" id="Text7" placeholder="Enter Zipcode">-->
                                    <!--                                    </div>-->
                                    <div class="col-md-12 mb-3">
                                        <label for="serviceRequest" class="form-label font-weight-bold text-muted text-uppercase">服务内容</label>
                                        <textarea class="form-control" rows="2" placeholder="Serve"
                                                  th:value="${serve !=null ?serve.serviceRequest : ''}" required maxlength="50"
                                                  id="serviceRequest"
                                                  name="serviceRequest"
                                        ></textarea>
                                    </div>

<!--                                    <input type="hidden" th:value="${serve.createPeople == session.role.username}"/>-->
                                    <!--                                    <div class="col-md-12 mb-3">-->
                                    <!--                                        <label class="form-label font-weight-bold text-muted text-uppercase mb-3">Notification Type</label><br>-->
                                    <!--                                        <div class="form-check form-check-inline">-->
                                    <!--                                            <div class="custom-control custom-checkbox custom-control-inline">-->
                                    <!--                                                <input type="checkbox" class="custom-control-input m-0" id="inlineCheckbox1">-->
                                    <!--                                                <label class="custom-control-label" for="inlineCheckbox1">Email</label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                        <div class="form-check form-check-inline">-->
                                    <!--                                            <div class="custom-control custom-checkbox custom-control-inline">-->
                                    <!--                                                <input type="checkbox" class="custom-control-input m-0" id="inlineCheckbox2">-->
                                    <!--                                                <label class="custom-control-label" for="inlineCheckbox2">SMS</label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                        <div class="form-check form-check-inline">-->
                                    <!--                                            <div class="custom-control custom-checkbox custom-control-inline">-->
                                    <!--                                                <input type="checkbox" class="custom-control-input m-0" id="inlineCheckbox3">-->
                                    <!--                                                <label class="custom-control-label" for="inlineCheckbox3">Phone</label>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                    </div>                                    -->
                                </form>
                                <div class="d-flex justify-content-end mt-3">
                                    <button type="submit" class="btn btn-primary">
                                        添加
                                    </button>
                                </div>
                            </div>
                        </form>


                        </div>
                    </div>
                </div>                
            </div>
        </div>
    </div>

      </div>
    </div>
    <!-- Wrapper End-->
    <footer class="iq-footer">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-6">
                    <ul class="list-inline mb-0">
                        <li class="list-inline-item"><a href="privacy-policy.html">Privacy Policy</a></li>
                        <li class="list-inline-item"><a href="terms-of-service.html">Terms of Use</a></li>
                    </ul>
                </div>
<!--                <div class="col-lg-6 text-right">-->
<!--                    <span class="mr-1">Copyright &copy; 2021.Company name All rights reserved.<a target="_blank" href="https://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></span>-->
<!--                </div>-->
            </div>
        </div>
    </footer>    <!-- Backend Bundle JavaScript -->
    <script src="../assets/js/backend-bundle.min.js"></script>
    <!-- Chart Custom JavaScript -->
    <script src="../assets/js/customizer.js"></script>
    
    <script src="../assets/js/sidebar.js"></script>
    
    <!-- Flextree Javascript-->
    <script src="../assets/js/flex-tree.min.js"></script>
    <script src="../assets/js/tree.js"></script>
    
    <!-- Table Treeview JavaScript -->
    <script src="../assets/js/table-treeview.js"></script>
    
    <!-- SweetAlert JavaScript -->
    <script src="../assets/js/sweetalert.js"></script>
    
    <!-- Vectoe Map JavaScript -->
    <script src="../assets/js/vector-map-custom.js"></script>
    
    <!-- Chart Custom JavaScript -->
    <script src="../assets/js/chart-custom.js"></script>
    <script src="../assets/js/01.js"></script>
    <script src="../assets/js/02.js"></script>
    
    <!-- slider JavaScript -->
    <script src="../assets/js/slider.js"></script>
    
    <!-- Emoji picker -->
    <script src="../assets/js/index.js" type="module"></script>
    
    
    <!-- app JavaScript -->
    <script src="../assets/js/app.js"></script>

    <script>
        //为表单注册提交事件
        $('form.needs-validation').submit(function (event) {
            //调用表单对象的验证方法，如果验证方法返回true，说明表单所有域都填写正确，否则返回false
            if(this.checkValidity()===false){
                //为表单添加珠失败后的样式类
                $(this).addClass('was-validated')
                return false;
            }

            return true;

        })
    </script>

  </body>
</html>